<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title>Add Cursos</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta name="viewport"
		content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
	<link rel="stylesheet" href="../static/css/estilo.css" />
	<link rel="stylesheet" href="../static/css/fonts.css" />
	
	<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
	<!-- <script src="http://code.jquery.com/jquery-latest.js"></script> -->
	<script src="../static/js/menu.js"></script>
</h:head>
<body style="font-size: 70%">

	<header> <ui:include src="/template/header.jsp" /> <ui:include
		src="/template/amenu.xhtml" />
	<h3>Creación de Cursos</h3>
	</header>
	<p:panel id="panel1" style="width :700px; font-weight: bold">
		<h:form id="form2">
			<p:growl id="growl" showDetail="true" />
			<p:panel header="Nombre del curso">
				<p:panelGrid columns="2">
					<h:outputText value="Curso" />
					<p:inputText value="#{backingCurso.nombreCurso}" />
					<h:outputText value="Especialidad:" />
					<p:selectOneMenu id="especialidad"
						value="#{backingCurso.idEspecialidad}">
						<f:selectItem itemLabel="Seleccione..." itemValue="-1"
							noSelectionOption="true" />
						<f:selectItems value="#{backingCurso.listaEspecialidadesSI}" />
					</p:selectOneMenu>
					<p:commandButton id="guardar" value="Guardar todos los cambios"
						action="#{backingCurso.crearNuevaCurso()}" update=":form2 growl" />
					<p:tooltip id="toolTipContent" for="guardar">
						<p:graphicImage value="./img/Save.png" />
					</p:tooltip>
				</p:panelGrid>
			</p:panel>
		</h:form>
		<h:form id="form3">
			<p:growl id="growl2" showDetail="true" />
			<p:panel header="Paralelos">
				<p:panelGrid columns="5" border="1">
					<h:outputText value="Nombre del Paralelo:" />
					<p:inputText value="#{backingCurso.nombreParalelo}"
						style=" width : 146px;" />
					<p:commandButton value="adicionar" id="mas"
						action="#{backingCurso.insertarParalelo()}" update="form3 growl2"
						icon="ui-icon-plusthick" />
					<p:tooltip id="toolTipMas" for="mas">
						<p:graphicImage value="./img/mas.png" />
					</p:tooltip>
				</p:panelGrid>
				<p:dataTable value="#{backingCurso.listaParalelos}" var="d"
					id="tablaParalelos">
					<f:facet name="header">
						<h:outputText value="Paralelos:" />
					</f:facet>
					<p:column>
						<f:facet name="header">
PARALELOS
</f:facet>
						<h:outputText value="#{d.nombreParalelo}" />
					</p:column>
					<p:column>
						<f:facet name="header">
ESTADO
</f:facet>
					<div align="center">
						<p:selectBooleanButton id="btnEstado" value="#{d.estado}"
							onLabel="Activo" offLabel="Inactivo"
							onIcon="ui-icon-circle-check" offIcon="ui-icon-circle-close">
						</p:selectBooleanButton>
					</div>
				
					</p:column>
					<p:column>
						<f:facet name="header">
ELIMINAR
</f:facet>
						<p:commandButton id="btnremove" icon="ui-icon-trash"
							actionListener="#{backingCurso.eliminarParalelo(d)}"
							update=":form3" />
					</p:column>
				</p:dataTable>
			</p:panel>
		</h:form>
	</p:panel>

</body>
</html>